<template>
	<view class="content-box">
		<view class="content-box-top"> 
		</view>
		<view class="back_btn_box">
			<image src="../../static/training/back.png" style="width: 20rpx;" mode="widthFix" @click="back"></image>
		</view>
		<view class="share_btn_box">
			<image src="../../static/training/share.png" style="width: 40rpx;" mode="widthFix"></image>
		</view>
		<view class="m-left-92 tr_info mtop20">
			<view class="status ing">
				<text class="msg_ing">训练中</text>
			</view>
			<view class="m-left-92 title">
				{{info.trainingClassName}}
			</view>
			<view class="m-left-92 bianhao">
				<view class="b_lable">
					培训编号
				</view>
				<view class="b_no">
					{{info.templateId}}
				</view>
			</view>
		</view>
		<view class="m-left-92 qd_info">
			<view class="m-left-92">
				<view class="item">
					<view class="item_1">
						<view class="item_1_1">
							应签到人数:{{sign.should_sign_count}}人
						</view>
						<view class="item_1_2">
							<image src="../../static/training/qiandao.png" class="img" mode="widthFix"></image>
							<text class="nums">
								签到人数:{{sign.should_sign_count}}人
							</text>
						</view>
					</view>
					<view class="item_1">
						<image src="../../static/training/tx_img.png" class="hdmg" mode="widthFix" @click="toSign()"></image>
					</view>
				</view> 
				<view class="item line_s">
					<view class="item_1 item_1_3">
						<view class="item_1_2"> 
							<text class="nums">
								签到要求:本人人脸识别签到
							</text>
						</view> 
						<view class="item_1_2"> 
							<text class="nums">
								需要打开手机本地相册权限 
								<text style="color: #1C67FE;margin-left: 15rpx;">设置权限</text> 
							</text>
						</view>
						<view class="qupx" @click="course()">
							去培训
						</view>
					</view> 
				</view>
				<view class="left_30"></view>
			</view>
		</view>
		
		
		<view class="m-left-92 qd_info">
			<view class="m-left-92">
				<view class="info_kejian_info">
					<view class="item se">
						基础信息
						<view class="se_box"></view>
					</view>
					<view class="item" @click="course">
						课节信息
					</view>
				</view> 
			</view>
			<view class="info_kejian_info_detail">
				<view class="m-left-92">
					<!-- <view class="item">
						<view class="b1">
							<image src="../../static/training/pxlx1.png" class="img_01" mode="widthFix"></image>
						</view>
						<view class="b2">
							<view class="d1">
								培训类型
							</view>
							<view class="d2">
								培训类型
							</view>
						</view>
					</view> -->
					<view class="item">
						<view class="b1">
							<image src="../../static/training/pxlx2.png" class="img_01" mode="widthFix"></image>
						</view>
						<view class="b2">
							<view class="d1">
								承办单位 
							</view>
							<view class="d2">
								职教科
							</view>
						</view>
					</view>
					 <view class="item">
					 	<view class="b1">
					 		<image src="../../static/training/pxlx3.png" class="img_01" mode="widthFix"></image>
					 	</view>
					 	<view class="b2">
					 		<view class="d1">
					 			培训性质 
					 		</view>
					 		<view class="d2">
					 			适应性
					 		</view>
					 	</view>
					 </view>
					 <view class="item">
					 	<view class="b1">
					 		<image src="../../static/training/pxlx4.png" class="img_01" mode="widthFix"></image>
					 	</view>
					 	<view class="b2">
					 		<view class="d1">
					 			培训形式 
					 		</view>
					 		<view class="d2">
					 			{{info.trainingFormName}}
					 		</view>
					 	</view>
					 </view>
					 <view class="item">
					 	<view class="b1">
					 		<image src="../../static/training/pxlx5.png" class="img_01" mode="widthFix"></image>
					 	</view>
					 	<view class="b2">
					 		<view class="d1">
					 			培训地点 
					 		</view>
					 		<view class="d2">
					 			{{info.trainingAddressTypeName}}
					 		</view>
					 	</view>
					 </view>
					 <view class="item">
					 	<view class="b1">
					 		<image src="../../static/training/pxlx6.png" class="img_01" mode="widthFix"></image>
					 	</view>
					 	<view class="b2">
					 		<view class="d1">
					 			总课时 
					 		</view>
					 		<view class="d2">
					 			{{info.trainingTotalClassHoursName}}
					 		</view>
					 	</view>
					 </view>
					 <view class="item" style="width: 88%;">
					 	<view class="b1" style="width: 80rpx;">
					 		<image src="../../static/training/info_time.png" class="img_01" mode="widthFix"></image>
					 	</view>
					 	<view class="b2">
					 		<view class="d1">
					 			开始日期~结束日期 
					 		</view>
					 		<view class="d2">
					 			{{info.trainingCycleStartDate}}~{{info.trainingCycleEndDate}}
					 		</view>
					 	</view>
					 </view>
				</view> 
			 </view>
			 <view class="m-left-92" style="border-top: 3rpx dashed #cccccc;margin-top: 60rpx;"></view>
			 <view class="info_kejian_info_detail" style="border: none;margin-top: 50rpx;display: none;">
			 	<view class="m-left-92"> 
			 		 <view class="item" style="width: 88%;height: auto;">
			 		 	<view class="m-left-92" style="line-height: 60rpx;margin-top: 20rpx;">
							已关联考核分
						</view>
						<view class="kf_item">
							<view class="kf_item_b1">
								<image src="../../static/training/jia.png" class="kf_item_b2" mode="widthFix"></image>
							</view>
							<view class="kf_item_b3">
								<view class="kf_item_b4">
									参与培训 
								</view>
								<text class="kf_item_b5">3分</text>
							</view>
						</view>
						 
						<view class="kf_item">
							<view class="kf_item_b1">
								<image src="../../static/training/jian.png" class="kf_item_b2" mode="widthFix"></image>
							</view>
							<view class="kf_item_b3">
								<view class="kf_item_b4">
									参与培训 
								</view>
								<text class="kf_item_b5">3分</text>
							</view>
						</view>
						<view class="magin_top20"></view>  
			 		 </view>
					 <view class="item" style="width: 88%;">
						<view class="ks_item_01">
							<view class="title">
								考试名称标题描述文字
							</view>
							<view class="msg">
								需要人脸识别，间隔60”
							</view>
						</view>
						<view class="ks_item_02">
							<view class="btn" @click="topic">
								去考试>
							</view>
						</view>
					 </view>
					<view class="item" style="width: 88%;">
						<view class="ks_item_01">
							<view class="title">
								考试名称标题描述文字
							</view> 
						</view>
						<view class="ks_item_02">
							<view class="btn">
								去考试>
							</view>
						</view>
					 </view>	
					<view class="item" style="width: 88%;">
						<view class="ks_item_01">
							<view class="info">
								同步岗位合格证
							</view> 
						</view> 
					 </view>
					<view class="item" style="width: 88%;">
						<view class="ks_item_01">
							<view class="info">
								刘海洋(所属组织/岗位)
							</view> 
						</view> 
					 </view>														   
			 	</view>
				 
			  </view>
			<view class="left_30"></view>
		</view>
		<view class="magin_top20"></view>  
	</view>

</template>

<script>
	import {
		numsForSign,baseInfo,ifSign,sign
	} from "@/common/api/training/training.js";
	export default {
		data() {
			return {
				sign:{
					should_sign_count:7,
					signed_count:7
				},
				info:{
					
				},
				ifSign:false
			};
		},
		onLoad(query) {
			if(query.id){
				numsForSign({id:query.id}).then((res) => {
					if (res && res.code == 200 && res.data) {
						this.sign=res.data
					}
				}); 
				baseInfo({id:query.id}).then((res) => {
					if (res && res.code == 200 && res.data) {
						if(res.data.trainingCycleEndDate){
							res.data.trainingCycleEndDate=res.data.trainingCycleEndDate.substring(0,10);
						}
						if(res.data.trainingCycleStartDate){
							res.data.trainingCycleStartDate=res.data.trainingCycleStartDate.substring(0,10);
						}
						this.info=res.data
					}
				});
				ifSign({id:query.id}).then((res) => {
					if (res && res.code == 200 && res.data) {
						this.ifSign=res.data.ifSign;  
					}
				});
			}
			
		},
		methods: {
			back(){
				uni.switchTab({
					url:"/pages/index/index"
				})
			},
			course(){
				uni.navigateTo({
					url:"/pages/training/course?id="+this.info.id
				})
			},
			topic(){
				uni.navigateTo({
					url:"/pages/training/topic"
				})
			},
			toSign(){
				if(this.ifSign){
					uni.showToast({
						title: '已签到',
						icon: 'none'
					})
					return;
				}
				sign({id:this.info.id}).then((res) => {
					if (res && res.code == 200 && res.data) {
						this.ifSign=true; 
						uni.showToast({
							title: '签到成功',
							icon: 'none'
						})
					}
				});
			}
		},
	};
</script>

<style lang="scss" scoped>
	@import url("../../common/base.css");
	@import "./info.scss";

	page {
		background-color: #F2F3F6;
	}
</style>